<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<%namespace name="h" module="cpswarehouse.helpers"/>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <title>CPS Racial/Ethnic Survey Warehouse and Visualization Tool - ${self.header()}</title>
    ##${str(h.stylesheet_link('/style.css'))}    
    <link href="/static/style2.css" media="screen" rel="stylesheet" type="text/css" /> 
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

    ${self.js()} <!-- move to bottom? -->
<script type="text/javascript">
  // Load the Visualization API and the piechart and linechart package.
  // TODO fix this to just load the stuff we need on the pages we need them
  google.load('visualization', '1', {'packages':['piechart', 'linechart']});


  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-2031253-3']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>
  </head>
  <body>
  <div id="container">
    <div id="header">
      <h1>CPS Racial/Ethnic Survey Warehouse and Visualization Tool</h1>
    </div>
    <div id="wrapper">
      <div id="content">
        <h2>${self.header()}</h2>
        <br/>
        ${next.body()}\
      </div>
    </div>

    <div id="navigation">
      <div class="box">
	    <ul>
          <li><a href="${request.route_url("index")}">Home</a></li>
          <li><a href="${request.route_url("what_is_this")}">About</a></li>
        </ul>
        <br/>
        <ul>
	      <li><a href="${request.route_url("school_listing")}">Find Schools By Name</a></li>
	      <li><a href="${request.route_url("schools_on_a_map")}">Find Schools On a Map</a></li>
	      <li><a href="${request.route_url("year_listing")}">Year By Year Summaries</a></li>
	      ##<li><a href="">Most Diverse Schools</a></li>
	      ##<li><a href="">Least Diverse Schools</a></li>
	    </ul>
        <br/>
        <ul>
          ##<li><a href="${request.route_url("tutorial")}">Build a Site Like This</a></li>
          <li><a href="${request.route_url("get_involved")}">Get Involved</a></li>
        </ul>
      </div>
    </div>

    <div align="center" id="footer">
      <br/><br/>
      <p>
      by <a href="http://thatmattbone.com/">Matt Bone</a> | 
      with help from the <a href="http://etl.luc.edu/">Emerging Technologies Laboratory</a> |
      <a href="http://cpswarehouse.googlecode.com">Get the Code</a> | 
      <a href="${request.route_url("dont_scrape_me")}">Don't Scrape Me</a>
      </p>
    </div>
  </div>
  </body>
</html>
<%def name="js()">
</%def>
